<?php ob_start() ?>

    <!-- 主内容区 -->
    <div class="pt-16 pb-8 min-h-screen">
        <div class="container mx-auto px-4">
            <!-- 页面标题 -->
            <div class="mt-8 mb-6 flex flex-col md:flex-row md:items-center md:justify-between">
                <div>
                    <h2 class="text-[clamp(1.5rem,3vw,2.5rem)] font-bold text-gray-800">特征状态设置</h2>
                    <p class="text-gray-600 mt-1">设置特征的开启或关闭状态</p>
                </div>
            </div>

            <!-- 成功和错误提示 -->
            <?php if (session()->has('success')): ?>
                <div class="text-green-500 mb-4"><?= session('success') ?></div>
            <?php endif; ?>
            <?php if (session()->has('error')): ?>
                <div class="text-red-500 mb-4"><?= session('error') ?></div>
            <?php endif; ?>

            <!-- 特征设置表单 -->
            <form action="<?= base_url('feature/set_feature') ?>" method="post" class="bg-white rounded-xl shadow-lg p-6">
                <table class="w-full">
                    <thead>
                        <tr>
                            <th class="text-left pb-2">特征键</th>
                            <th class="text-left pb-2">当前状态</th>
                            <th class="text-left pb-2">设置状态</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($features as $feature): ?>
                            <tr>
                                <td class="py-2">
                                    <input type="hidden" name="feature_key[]" value="<?= $feature['feature_key'] ?>">
                                    <?= $feature['feature_name'] ?>
                                </td>
                                <td class="py-2"><?= $feature['status'] ? '开启' : '关闭' ?></td>
                                <td class="py-2">
                                    <select name="status[]" class="pl-2 pr-4 py-1 rounded-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-primary/50 focus:border-primary transition-all duration-200">
                                        <option value="1" <?= $feature['status'] ? 'selected' : '' ?>>开启</option>
                                        <option value="0" <?= !$feature['status'] ? 'selected' : '' ?>>关闭</option>
                                    </select>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
                <button type="submit" class="mt-6 px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-opacity-50">保存设置</button>
            </form>

             <!-- 清除链接记录按钮 -->
            <button onclick="confirmClearLinks()" class="mt-6 px-4 py-2 bg-yellow-600 text-white rounded-md hover:bg-yellow-700 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:ring-opacity-50">清除链接记录</button>

             <!-- 清除链接记录按钮 -->
            <button onclick="confirmClearActitityLogs()" class="mt-6 px-4 py-2 bg-yellow-600 text-white rounded-md hover:bg-yellow-700 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:ring-opacity-50">清除用户记录</button>

            <!-- 用于显示删除结果的元素 -->
            <div id="delete-result" class="mt-4"></div>
        </div>
    </div>

    <script>
        function confirmClearLinks() {
            if (confirm("是否确认清空链接？")) {
                // 使用 fetch API 发起 POST 请求
                fetch("<?= base_url('feature/clear_page_links') ?>", {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest'
                    },
                    body: JSON.stringify({})
                })
               .then(response => response.json())
               .then(data => {
                    const resultElement = document.getElementById('delete-result');
                    if (data.success) {
                        resultElement.classList.remove('text-red-500');
                        resultElement.classList.add('text-green-500');
                        resultElement.textContent = data.message;
                    } else {
                        resultElement.classList.remove('text-green-500');
                        resultElement.classList.add('text-red-500');
                        resultElement.textContent = data.message;
                    }
                })
               .catch(error => {
                    const resultElement = document.getElementById('delete-result');
                    resultElement.classList.remove('text-green-500');
                    resultElement.classList.add('text-red-500');
                    resultElement.textContent = '请求出错：' + error.message;
                });
            }
        }

        function confirmClearActitityLogs() {
            if (confirm("是否确认清空用户记录？")) {
                // 使用 fetch API 发起 POST 请求
                fetch("<?= base_url('feature/clear_activity_logs') ?>", {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest'
                    },
                    body: JSON.stringify({})
                })
               .then(response => response.json())
               .then(data => {
                    const resultElement = document.getElementById('delete-result');
                    if (data.success) {
                        resultElement.classList.remove('text-red-500');
                        resultElement.classList.add('text-green-500');
                        resultElement.textContent = data.message;
                    } else {
                        resultElement.classList.remove('text-green-500');
                        resultElement.classList.add('text-red-500');
                        resultElement.textContent = data.message;
                    }
                })
               .catch(error => {
                    const resultElement = document.getElementById('delete-result');
                    resultElement.classList.remove('text-green-500');
                    resultElement.classList.add('text-red-500');
                    resultElement.textContent = '请求出错：' + error.message;
                });
            }
        }
    </script>

<?php $content = ob_get_clean() ?>

<?= view('layouts/base', ['content' => $content]) ?>